<template>
	<view class="container">
		<view class="title">
			{{template.typeName}}-{{template.courseName}}
		</view>
		<view class="time">
			课程时间{{template.duration}}分钟
		</view>
		<view class="month-info">
			课程对象{{template.beginMonth}}-{{template.endMonth}}月
		</view>
		
		<title-index class="title-tag" title="核心能力目标"></title-index>
		<view class="core-competence">
			<course-core-competence competence="Q" :coreCompetence="template.coreCompetence"></course-core-competence>
			<course-core-competence competence="Z" :coreCompetence="template.coreCompetence"></course-core-competence>
			<course-core-competence competence="L" :coreCompetence="template.coreCompetence"></course-core-competence>
		</view>
		
		<title-index class="title-tag" title="综合能力目标"></title-index>
		<view class="core-competence">
			<course-skill skill="精细动作" :integratedSkill="template.integratedSkill"></course-skill>
			<course-skill skill="大肢体运动" :integratedSkill="template.integratedSkill"></course-skill>
			<course-skill skill="记忆力" :integratedSkill="template.integratedSkill"></course-skill>
		</view>
		<view class="core-competence">
			<course-skill skill="语言表达" :integratedSkill="template.integratedSkill"></course-skill>
			<course-skill skill="自我服务" :integratedSkill="template.integratedSkill"></course-skill>
			<course-skill skill="自我学习" :integratedSkill="template.integratedSkill"></course-skill>
		</view>
		
		<title-index class="title-tag" title="综合教学目标"></title-index>
		<view class="subtitle">综合教学目标之爱商</view>
		<view class="sub-content">
			{{template.goalLoveQuotient}}
		</view>
		<view class="subtitle">综合教学目标之中国传统文化</view>
		<view class="sub-content">
			{{template.goalTraditionalCulture}}
		</view>
		<view class="subtitle">综合教学目标之家国责任</view>
		<view class="sub-content">
			{{template.goalStateResponsibility}}
		</view>
		<view class="subtitle">综合教学目标之科技和其他</view>
		<view class="sub-content">
			{{template.goalTechnologyOther}}
		</view>
		
		<title-index class="title-tag" title="教学准备"></title-index>
		<u-grid :col="4">
			<u-grid-item v-for="(item,index) in template.tools">
				<u-icon name="photo" :size="46"></u-icon>
				<view class="grid-text">图片</view>
			</u-grid-item>
		</u-grid>
	</view>
</template>

<script>
	import TitleIndex from '../../components/title-index.vue'
	import CourseCoreCompetence from  './components/course-core-competence.vue'
	import CourseSkill from  './components/course_skill.vue'
	export default {
		name: "CourseDetailInfoView",
		components: {
			TitleIndex,
			CourseCoreCompetence,
			CourseSkill
		},
		props: {
			template: {
				type: Object,
				default () {
					return {}
				}
			},
		},
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.container{
		padding-left: 20rpx;
		padding-right: 20rpx;
		padding-bottom: 20rpx;
		
		.title{
			margin-top: 20rpx;
			font-weight: bold;
			font-size: 40rpx;
		}
		
		.time{
			margin-left: 20rpx;
			margin-top: 20rpx;
		}
		
		.month-info{
			margin-left: 20rpx;
		}
		
		.title-tag{
			margin-top: 40rpx;
		}
		
		.core-competence{
			margin-left: 40rpx;
			margin-right: 40rpx;
			margin-top: 20rpx;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
		}
		
		.subtitle{
			margin-left: 40rpx;
			font-weight: bold;
			font-size: 28rpx;
			margin-top: 20rpx;
		}
		.sub-content{
			margin-left: 40rpx;
			color: $app-font-color;
			font-size: 26rpx;
			margin-top: 10rpx;
		}
	}
</style>
